/**
 * @Description:
 * @author
 * @date 11:00 上午
 * 指令
 */
import Vue from "vue";
import store from "@/store";
import router from "@/router";

/**
 * 权限按钮
 */
Vue.directive("rights", {
  inserted: function(el, binding, vnode) {
    const userRights = store.getters.operateMap;
    if (!userRights.get(`${router.history.current.path}/${binding.value}`)) {
      el.parentNode.removeChild(el);
    }
  },
});

/**
 * 全屏非全屏转换按钮
 */
import full from "@/assets/img/full.png";
import unfull from "@/assets/img/unfull.png";
Vue.directive("toggleFull", (el, binding) => {
  const headerEl = el.querySelector(".el-dialog__header");
  if (!headerEl) return;
  let imgEl = headerEl.getElementsByTagName("IMG")[0];
  if (!imgEl) {
    imgEl = document.createElement("img");
    imgEl.src = full;
    imgEl.title = "全屏";
    setTimeout(() => {
      if (!el.querySelector(".panna-dialog_big")) return;
      imgEl.onclick = () => {
        if (binding.value instanceof Function) binding.value();
        const fullDialogEl = el.querySelector(".panna-dialog_big");
        if (fullDialogEl) {
          fullDialogEl.className = "el-dialog panna-dialog_full";
          imgEl.title = "取消全屏";
          imgEl.src = unfull;
        } else if (el.querySelector(".panna-dialog_full")) {
          imgEl.src = full;
          imgEl.title = "全屏";
          el.querySelector(".panna-dialog_full").className =
            "el-dialog panna-dialog_big";
        }
      };
      if (headerEl.getElementsByTagName("IMG")[0]) return;
      imgEl.style.cssText =
        "position: absolute; top: 16px; right: 40px; cursor: pointer;";
      headerEl.appendChild(imgEl);
    }, 10);
  }
});
